<template>
  <div>
    <!-- 登录表单的内容可以在此处渲染，配合 Element Plus 的组件 -->
    <el-form :model="loginForm">
      <!-- 手机号输入框 -->
      <el-form-item label="手机号">
        <el-input v-model="mobile" placeholder="请输入手机号" />
      </el-form-item>
      
      <!-- 密码输入框 -->
      <el-form-item v-if="loginWay === 'pwd'" label="密码">
        <el-input v-model="password" placeholder="请输入密码" type="password" />
      </el-form-item>

      <!-- 验证码输入框 -->
      <el-form-item v-if="loginWay === 'code'" label="验证码">
        <el-input v-model="code" placeholder="请输入验证码" />
      </el-form-item>

      <!-- 同意协议勾选框 -->
      <el-checkbox v-model="agreement">{{ agreementContent }}</el-checkbox>

      <!-- 登录按钮 -->
      <el-button type="primary" @click="tologin">登录</el-button>
    </el-form>
  </div>
</template>

<script setup>
import { ref, computed, onMounted } from 'vue'
import { useStore } from 'vuex'
import { ElMessage } from 'element-plus'
import { useRouter } from 'vue-router'

const store = useStore()
const router = useRouter()

const loginWay = ref('code')
const agreement = ref(false)
const agreementContent = ref('请阅读并同意')
const mobile = ref('')
const password = ref('')
const code = ref('')
const agreementDatas = ref([])
const authorize = ref(0)
const bindMobileShow = ref(false)
const privacyShow = ref(false)
const agreeToLogin = ref(0)

const member = computed(() => store.state.member)
const config = computed(() => store.state.config)

onMounted(() => {
  // 加载环境信息
  getEnv()

  // 加载用户缓存的登录信息
  loadStorage()

  // 微信登录服务初始化
  initWeixinAuth()
})

const getEnv = async () => {
  const env = await store.dispatch('getEnv')
  // 处理环境数据
}

const loadStorage = () => {
  uni.getStorage({
    key: '__mobile',
    success: (res) => {
      mobile.value = res.data || ''
    }
  })

  uni.getStorage({
    key: '__loginWay',
    success: (res) => {
      loginWay.value = res.data || 'code'
    }
  })
}

const initWeixinAuth = () => {
  // 初始化微信登录服务等逻辑
}

const tologin = async () => {
  if (!mobile.value) {
    ElMessage.error('请输入手机号')
    return
  }

  if (loginWay.value === 'pwd') {
    if (!password.value || password.value.length < 4) {
      ElMessage.error('密码长度不能小于4位')
      return
    }
    // 密码登录逻辑
  } else if (loginWay.value === 'code') {
    if (!code.value || code.value.length !== 6) {
      ElMessage.error('验证码错误')
      return
    }
    // 验证码登录逻辑
  }

  // 登录成功后的处理逻辑
}

</script>

<style scoped>
/* 根据需要添加样式 */
</style>
